<template>
	<div class="dialog animated" :class="open? 'fadeIn':'fadeOut'" v-show="show">
		<div class="panel animated" :class="open? 'zoomIn':''">
			<div class="title">
				标记无效
				<div class="close" @click="cancel()"></div>
			</div>
		
		  	<div class="form">
		  		<div class="clue_list">
				  	<div class="clue-li">
				  		<div style="width: 2.8rem;">孩子姓名：
				  			<span class="name">{{clue.realName}}</span>
				  			<div class="sex" :class="clue.gender==2? 'sex_girl' : ''"></div>
				  		</div>
				  		<div style="width: 2.3rem;">
				  			家长：
				  			{{clue.parentData? clue.parentData[0].parentName : ''}}
				  		</div>
				  		<div style="width: 2.5rem;">
				  			联系电话：
				  			{{clue.parentData? clue.parentData[0].phone : ''}}
				  		</div>
				  	</div>
			  	</div>
			  	<div class="tip">您确定要标记该线索无效吗？</div>
		 	</div>
			<div class="btn_div">
				<div class="btn_sure" @click="sure()">确 认</div>
				<div class="btn_cancel" @click="cancel()">再考虑一下</div>
			</div>
		</div>
	</div>
</template>

<script>
var vm;
export default {
	data : function() {
		return {
			show : false,
			open : false,
			clue : {}
		}
	},
	methods : {
		init : function(clue) {
			vm.show = true;
			vm.open = true;
			
			vm.clue = tool.clone(clue);
			vm.clue.clueStatus = 7;
			vm.clue.isMatter = "0";
			vm.clue._wait = "";
			delete vm.clue.updateTime;
		},
		cancel : function() {
			//隐藏弹窗
			vm.open = false;
			setTimeout(function() {
				vm.show = false;
			},500);
		},
		sure : function() {
			api.clueUpdate(vm.clue).then(function(data) {
				vm.$emit('callback');
				vm.cancel();
				tool.message({showClose: true, message: "操作成功", type: 'success' });
			})
		},
		
	},
	created : function() {
		vm = this;
	}
}
</script>

<style scoped src="@/style/module/dialog.css"></style>
<style scoped>
	.panel {
		width: 8.53rem;
	}
	.form {
		padding: 0 0.3rem;
		color: #333333;
	}
	.clue_list {
		padding-bottom: 0.3rem;
		border-bottom: 0.01rem solid rgb(243,246,253);
	}
	.clue-li {
		padding-left: 0.15rem;
		height: 0.35rem;
		line-height: 0.35rem;
		overflow: hidden;
	}
	.clue-li>div{
		float: left;
	}
	.name {
		font-size: 0.2rem;
		font-weight: bold;
	}
	.sex {
		display: inline-block;
		position: relative;
		top: 0.03rem;
		width: 0.14rem;
		height: 0.18rem;
		background-image: url(../../../assets/img/clue_manage/boy.png);
		background-size: 100%;
	}
	.sex_girl {
		background-image: url(../../../assets/img/clue_manage/girl.png);
	}
	
	.tip {
		margin-top: 0.2rem;
		font-size: 0.2rem;
		color: #3885f8;
		text-align: center;
		letter-spacing: 0.01rem;
	}
	
</style>